<%@ page pageEncoding="UTF-8"%>
<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<%@ taglib prefix="isperp" uri="/WEB-INF/tlds/isperp.tld"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/fmt" prefix="fmt"%>
<script type="text/javascript" src="js/libs/util/map.js"></script>
<script type="text/javascript">
	function choseControl(option) {
		option = option || {};
		switch (option.controlType) {
		case "chosePerson":
			chosePerson(option)
			break;
		case "choseDepartment":
			break;
		default:
			break;
		}
	}
	function chosePerson(option) {
		option = option || {};
		var id = option.id;
		var vid = option.valueControlId;
		var inputObject = document.getElementById(vid);
		if (inputObject == null || inputObject == undefined) {
			var ov = option.controlOldValue || "";
			//$("<input id='"+vid+"' value='"+ov+"'/>").appendTo("#hideValueToDiv");
		}
		isperp.openDialog({
			id : "abcDialog",
			contentUrl : 'tags/selector/departmentUserSelector?idFieldName=name&dheight=465&ctId=' + id,
			onThisWindow : true,
			title : "选择人员",
			modal : false,
			width:560,
			height:465,
			resizable : false,
			buttons : [ {
				text : "确定",
				"class" : 'nui-mainbtn',
				click : function() {
					var row = $("#abcDialog").find("iframe")[0].contentWindow.getSelectedValue();
					SetSelected(row, id, vid);
				}
			}, {
				text : "关闭",
				"class" : 'grey',
				click : function() {
					$(this).wijdialog("close");
				}
			} ]
		});

	}
	function SetSelected(row, id, vid) {
		if (!row[0]) {
			isperp.alert("请选择一条数据！");
			return false;
		}
		$("#" + vid).val(row[0]);
		$("#" + id).val(row[1]);
		$("#abcDialog").wijdialog("close");
	}
</script>
<style>
table.gridtable {
	font-family: verdana, arial, sans-serif;
	font-size: 11px;
	color: #333333;
	border-width: 1px;
	border-color: #666666;
	border-collapse: collapse;
	width: 80%;
}

table.gridtable th {
	border-width: 1px;
	padding: 8px;
	border-style: solid;
	border-color: #666666;
	background-color: #dedede;
}

table.gridtable td {
	border-width: 1px;
	padding: 4px;
	border-style: solid;
	border-color: #666666;
	background-color: #ffffff;
}
</style>

<form:form commandName="model" cssClass="validate" id="changeForm"
	style="width:100%;">
	<input id="id" value="${model.id }" style="display:none">
	
	<div class="header" style='text-align: center'>
		<h3 style="font-weight: bold;font-size:19px">变更明细表(<span style="color:green;font-size:12px;">请编辑需要变更的资产属性</span>)</h3>
	</div>
	<div style="margin-left:5px;font-size:14px;">
		名称：<span style="">${model.name}&nbsp;&nbsp;&nbsp;&nbsp;</span>编号：<span
			style="font-weight: bold;">${model.code}</span>
	</div>
	<div
		style="text-align: center;margin:0 auto;width:100%;margin-top:5px;">
		<div style="text-align: center;margin:0 auto;width:100%;">
			<table align="center" class="gridtable" id="planChangeProTable_Basic"
				style="text-align: center;width:100%;margin-left:5px;">
				<tr style="color:green" align="center">
					<th style="width:17%;text-align: center" align="center"><span>配置项名</span>
					</th>
					<th style="width:30%;text-align: center" align="center"><span>当前值</span>
					</th>
					<th align="center" style="text-align: center"><span>计划变更值</span>
					</th>
				</tr>
				

			</table>
			
			<table id="planChangeProTable_Extend" class="gridtable"
				style="text-align: center;width:100%;margin-left:5px;"
				align="center">
			</table>
		</div>
	</div>
	<div style="text-align: center;margin-top:50px;display:none">
		<input type="button" value="保存" class="button nui-mainbtn"
			onclick="save();return false;"> <input type="button"
			value="取消" class="button nui-mainbtn"
			onclick="cusUserIdSelectorSelector.onClick();return false;">
	</div>


</form:form>
<script type="text/javascript">
	var initPryMap = new Map();
	function save() {
		//edit at 20150427
		var map = new Map(); //
		var changeId = '${changeId}';
		var afterEditPropetyMap = getPagePropetyMap(map);//所有的资产属性的id与值的map
		var compareResult = compareProperty(initPryMap, afterEditPropetyMap);//比较前后变化
		isperp.showLoading({
			onThisWindow : true
		});
		$.ajax({
			type : "POST",
			async : false,
			url : "configuration/ci/saveChangePropertyColumn",
			data : {
				changeId : changeId,
				"changeConfigurationList" : compareResult
			},
			success : function(data) {
				isperp.hideLoading();
			}
		});
		return false;
	}

	function compareProperty(oldPropertyMap, newPropertyMap) {

		var jsonResult = "[";
		var ciId = $("#id").val();
		var changeId = '${changeId }';
		var lsize = oldPropertyMap.size();
		for ( var i = 0; i < lsize; i++) {
			if (oldPropertyMap.element(i).value != newPropertyMap.element(i).value) {
				var columnkey = oldPropertyMap.element(i).key;
				var columnvalue = newPropertyMap.element(i).value;
				var columnvalueOld = oldPropertyMap.element(i).value;
				var isCategoryProprety = "0";
				if (oldPropertyMap.element(i).key.substring(0, 2) == "c_") {
					isCategoryProprety = "1";
					columnkey = oldPropertyMap.element(i).key.substring(2);
				}
				var columnname=$("#td_cname_"+columnkey).text();
				

				jsonResult += "{'changeId':'" + changeId + "','ciId':'" + ciId + "','columnname':'"+columnname+"','columnkey':'" + columnkey + "','columnvalue':'" + columnvalue + "','columnvalueBefore':'" + columnvalueOld + "','isCategoryProprety':'" + isCategoryProprety + "'},";
			}
		}
		if (jsonResult != "[")
			jsonResult = jsonResult.substring(0, jsonResult.length - 1);
		jsonResult += "]";
		return jsonResult;
	}
	function getPagePropetyMap(map) {

		$("#planChangeProTable_Basic input").each(function() {
			var obj_input = $(this);
			var obj_id = $(this).attr("name");
			var obj_value = $(this).val();
			map.put(obj_id, obj_value);

		});
		$("#planChangeProTable_Basic select").each(function() {
			var obj_input = $(this);
			var obj_id = $(this).attr("name");
			var obj_value = $(this).val();
			map.put(obj_id, obj_value);

		});
		$("#planChangeProTable_Basic textarea").each(function() {
			var obj_input = $(this);
			var obj_id = $(this).attr("name");
			var obj_value = $(this).next().html().replace(/&nbsp;/,"");
			map.put(obj_id, obj_value);

		});

		$("#planChangeProTable_Extend input").each(function() {
			var obj_input = $(this);
			var obj_id = $(this).attr("id");
			var obj_value = $(this).val();
			map.put(obj_id, obj_value);

		});
		$("#planChangeProTable_Extend select").each(function() {
			var obj_input = $(this);
			var obj_id = $(this).attr("id");
			var obj_value = $(this).val();
			map.put(obj_id, obj_value);
		});
		$("#planChangeProTable_Extend textarea").each(function() {
			var obj_input = $(this);
			var obj_id = $(this).attr("id");
			var obj_value = $(this).next().html().replace(/&nbsp;/,"");
			map.put(obj_id, obj_value);
		});

		return map;

	}

	$(function() {
		var confCategoryIdVal = '${model.confCategoryId}';
		$.ajax({
			async : false,
			url : "configuration/ci/getDyChangeCiProperty?ciId=${model.id}",
			success : function(data) {
				$("#planChangeProTable_Basic").append(data.data);
                isperp.initElement("#planChangeProTable_Basic");
				$.getJSON("configuration/category/property/listByCategory?categoryId=" + confCategoryIdVal, function(data) {
					$("#planChangeProTable_Extend").empty();
					var col = 2;
					var rStr = "<tr ><td colspan='3' align='left' style='border-top:none'><div class='gdhead' style='font-weight:bold'>配置信息</div></td></tr>";
					$(data).each(function(index, item) {
					    
						col--;
						if(index==0)
						{
						  rStr += "<td style=\"width:17%;border-top:none;\" id=\"td_cname_"+item.id+"\" >" + item.name + "</td><td id='c_oldValue_" + item.id + "' style=\"width:30%;border-top:none;\"></td><td align='left' style='border-top:none;'>" + createControl(item) + "</td>";
						}else
						{
						   rStr += "<td style=\"width:17%\" id=\"td_cname_"+item.id+"\">" + item.name + "</td><td id='c_oldValue_" + item.id + "' style=\"width:30%\"></td><td align='left'>" + createControl(item) + "</td>";
						}
						
						var row = "<tr>" + rStr + "</tr>";
						rStr = "";
						col = 2;

						$("#planChangeProTable_Extend").append(row);
					});

					if (data.length != 0) {
						$("#planChangeProTable_Extend").append("<tr>" + rStr + "</tr>");
						rStr = "";
					}

					setCiPropertyValue();
					//设置计划变更值
					setCiPlanPropertyValue();
					isperp.initElement("#planChangeProTable_Extend");
					//存储资产所有属性，当保存时如果存在改变的属性，则提交到后台记录
					//edit at 20150427
					getPagePropetyMap(initPryMap);

				});
			}
		});
	});
	function setCiPlanPropertyValue() {
		var ciId = '${model.id}';
		var changeId = '${changeId}';
		$.ajax({
			type : "POST",
			url : "configuration/ci/getPlanChangeCiValueByChangeId",
			data : {
				ciId : ciId,
				changeId : changeId
			},
			dataType : "json",
			success : function(data) {
				arrObj=data.data;
				for(var i=0;i<arrObj.length;i++)
				{
				   if(arrObj[i].is_category_proprety=="1")
				   {
				     if($("#c_"+arrObj[i].columnkey).get(0).tagName=="TEXTAREA")
				     {
				        $("#c_"+arrObj[i].columnkey).text(arrObj[i].columnvalue);
				     }else if($("#c_"+arrObj[i].columnkey).get(0).tagName=="SELECT")
				     {
				        $("#c_"+arrObj[i].columnkey).val(arrObj[i].columnvalue);
				        $("#c_"+arrObj[i].columnkey).trigger("chosen:updated");
				     }else($("#c_"+arrObj[i].columnkey).get(0).tagName=="INPUT")
				     {
				        $("#c_"+arrObj[i].columnkey).val(arrObj[i].columnvalue);
				     }
				      
				   }else
				   {
				      if($("#"+arrObj[i].columnkey).get(0).tagName=="TEXTAREA")
				     {
				        $("#"+arrObj[i].columnkey).text(arrObj[i].columnvalue);
				     }else if($("#"+arrObj[i].columnkey).get(0).tagName=="SELECT")
				     {
				        $("#"+arrObj[i].columnkey).val(arrObj[i].columnvalue);
				        $("#"+arrObj[i].columnkey).trigger("chosen:updated");
				     }else($("#"+arrObj[i].columnkey).get(0).tagName=="INPUT")
				     {
				        $("#"+arrObj[i].columnkey).val(arrObj[i].columnvalue);
				     }
				   }
				}
			}
		});
	}
	//设置自定义ci的属性
	function setCiPropertyValue() {
		var ciId = '${model.id}';
		$.ajax({
			type : "POST",
			url : "configuration/ci/listProperty",
			data : {
				id : ciId
			},
			async : false,
			dataType : "json",
			success : function(data) {
				$(data).each(function(index, item) {
					$("#c_" + item.confCategoryPropertyId).val(item.value);
					$("#c_oldValue_" + item.confCategoryPropertyId).text(item.value);
				});
			}
		});
	}
	//构建input元素
	function createInputElement(item, cssCls) {
		var controlStr = "<input style='width:80%' type='" + item.data_type + "' id='c_" + item.id + "' data-id='" + item.id + "' class='" + cssCls;

		if (item.notnull) {
			controlStr += " required";
		}

		controlStr += "' />"
		return controlStr;
	}
	//构建自定义属性输入控件
	function createControl(item) {
		var controlStr = "";
		var cssCls = "";
		switch (item.data_type) {
		case "string":
			controlStr = createInputElement(item, cssCls);
			break;
		case "number":
			cssCls = "number";
			item.data_type = "text";
			controlStr = createInputElement(item, cssCls);
			break;
		case "date":
		case "datetime":
			controlStr = createInputElement(item, cssCls);
			break;
		case "textarea":
			controlStr = "<textarea  id='c_" + item.id + "' data-id='" + item.id + "' class='" + cssCls;

			if (item.notnull) {
				controlStr += " required";
			}

			controlStr += "'></textarea>";
			break;

		case "select":
			controlStr = "<select  id='c_" + item.id + "'   data-id='" + item.id + "' ";
			if (item.notnull) {
				controlStr += " class='required'>";
			} else {
				controlStr += " >";
			}

			controlStr += "<option value=''></option>";

			if (item.items) {

				var itemArr = item.items.split("|");

				$(itemArr).each(function(i, it) {
					controlStr += "<option value='"+it+"'>" + it + "</option>";
				});
			}

			controlStr += "</select>";
			break;

		}

		return controlStr;

	}
</script>





